<!DOCTYPE html>
<html lang="zh-cmn-Hans">

<head>
	<meta charset="utf-8">
	<title>随机色</title>
	<style>
		#suijise span {
			display: inline-block;
			margin: 10px;
			color: #FFF;
		}
	</style>
</head>

<body>
	<div id="suijise"></div>
	<script>
		function getColor() {
			var colorElements = "0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f";
			var colorArray = colorElements.split(",");
			var color = "#";
			for (var i = 0; i < 6; i++) {
				color += colorArray[Math.floor(Math.random() * 16)];
			}
			return color;
		}
		function getColor1() {
			return '#' + ('00000' + (Math.random() * 0x1000000 << 0).toString(16)).slice(-6);
		}
		function getColor2(alpha) {
			let r = Math.floor(Math.random() * 256),
				g = Math.floor(Math.random() * 256),
				b = Math.floor(Math.random() * 256);
			if (alpha) {
				return `rgb(${r},${g},${b},${alpha})`;
			} else {
				return `rgb(${r},${g},${b})`;
			}
		}
	</script>
	<script>
		function create() {
			var el = null;
			for (var i = 0; i < 21; i++) {
				el = document.createElement('span');
				el.style.backgroundColor = getColor2();
				el.innerHTML = '随机色';
				suijise.appendChild(el);
			}
		}
	</script>
	<script>
		create();
	</script>
</body>

</html>